<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>个人音乐播放</title>
		<link rel="stylesheet" type="text/css" href="css/music.css"/>
	</head>
	<body>
		<!-- 头部横幅 -->
		<div class="banner">
			<ul>
				<li title="龙卷风" class="m1" datasrc="mp3/1.mp3">
					<img src="img/1.jpg" alt="" width="120" height="120">
				</li>
				<li title="bigbang" class="m2" datasrc="mp3/2.mp3">
					<img src="img/2.jpg" alt="" width="120" height="120">
				</li>
				<li title="绅士" class="m3" datasrc="mp3/3.mp3">
					<img src="img/3.jpg" alt=""width="120" height="120">
				</li>
				<li title="杀手" class="m4" datasrc="mp3/4.mp3">
					<img src="img/4.jpg" alt="" width="120" height="120">
				</li>
				<li title="baby" class="m5" datasrc="mp3/5.mp3">
					<img src="img/5.jpg" alt="" width="120" height="120">
				</li>
			</ul>
		</div>
		<!-- 播放器 -->
		<div class="music">
			<div class="m_img">
				<img src="img/1.jpg" width="120px" height="120px">
			</div>
			<div class="m_text">
				龙卷风
			</div>
			<div class="m_btn">
				<a href="#" class="m_prev" title="上一首"></a>
				<a href="#" class="m_play" title="播放"></a>
				<a href="#" class="m_next" title="下一首"></a>
			</div>
			<div class="m_close"></div>
			<audio src="mp3/1.mp3" class="m_mp3"></audio>
		</div>
		<script type="text/javascript" src="js/jquery.js"></script>
		<script src="./js/music.js" type="text/javascript" charset="utf-8"></script>
	</body>
</html>
